@use './src/styles/vendor/variables' as vv;
@use './src/styles/defaults/mixins';

@mixin row-details-icon {
  color: vv.$gray-900;
  font-family: 'ForkAwesome', sans-serif;
  font-size: 1rem;
  line-height: 1;
}

@keyframes progress-loading {
  from {
    left: -200px;
    width: 15%;
  }

  50% {
    width: 30%;
  }

  70% {
    width: 70%;
  }

  80% {
    left: 50%;
  }

  95% {
    left: 120%;
  }

  to {
    left: 100%;
  }
}

.reload {
  animation-duration: 2500ms;
  animation-iteration-count: infinite;
  animation-name: spin;
  animation-timing-function: linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.no-data {
  font-size: 1.1rem;
  height: 5rem;
}

::ng-deep .table-actions {
  display: flex;
  flex-flow: row-reverse;
  gap: 0.1em;
}

.filter-tags {
  background-color: var(--cds-layer-accent);
  border-bottom: 1px solid var(--cds-layer-active);
  color: var(--cds-text-primary);
}

::ng-deep div.cds--batch-actions.cds--batch-actions--active {
  background-color: vv.$primary;
}

::ng-deep div.cds--batch-summary {
  background-color: vv.$primary;
}
